<template>
<div>
	

<el-collapse v-model="activeName" accordion>
  <el-collapse-item
   v-for="(item, index) in distributionLevelList.results"
   :name="index">
   	<template slot="title">
   		{{item.title}} 
   	</template>
    
    <el-form 
		:model="item" 
		label-width="180px"
		>
		<!-- <el-form-item label="级别编号：" >
			<el-input v-model="item.code" placeholder="请输入级别编号" 
			class="w300"></el-input>
		</el-form-item> -->
		<el-form-item label="级别名称：" >
			<el-input v-model="item.title" placeholder="请输入级别名称" 
			class="w300"></el-input>
		</el-form-item>

		<el-form-item >
		     <el-button type="primary" 
		     @click="save(item)">
		     保存</el-button>
		</el-form-item>

	</el-form>	
  </el-collapse-item>
  
</el-collapse>

<!-- <el-button type="primary" class="mt20" @click="createDistributionLevel()">添加一个分销级别</el-button> -->

</div>		
</template>

<script>

import { mapGetters } from 'vuex'

export default {
	name: 'distributionlevel',
		data () {
		return {
		  	activeName : -1,
		}
	},

	props: {

	},

	components: {
		
	},

	computed : {
		...mapGetters([
			'distributionLevelList',
		]),
	},

	methods : {
		save (item) {
			let para = {
				id : item.id,
				//code : item.code,
				title : item.title,
				cb : res => {
					this.$notify({
			          title: '成功',
			          message: '保存成功',
			          type: 'success'
			        });
			        this.$store.dispatch('getDistributionLevelList');
				},
				err : res => {
					this.$notify({
			          title: '保存失败',
			          message: res,
			          type: 'error'
			        });
				}
			};

			this.$store.dispatch('updateDistributionLevel', para);
		},

		createDistributionLevel () {
			var obj = {
				code : '',
				title : '',
			};

			this.distributionLevelList.results.push(obj);
			this.activeName = this.distributionLevelList.results.length - 1;
		},
	},

	watch : {
	    
	},

	mounted () {
		
		this.$store.dispatch('getDistributionLevelList');
		
	},

}
</script>

<style scoped>

</style>
